<script setup lang="ts">
const {waterForm} = defineProps<{
  waterForm: Object
}>();

</script>

<template>
  <div class="card">
    <el-card class="box-card">
      <h1 style="text-align: center">水质 碱度分析原始记录（B面）</h1>
      <div>SXLPHJ/JL/CX-22-53</div>
      <table class="table">
        <tr>
          <td colspan="8">
            <div class="table-td">
              溶液配制
            </div>
          </td>
        </tr>
        <tr>
          <td>标准溶液名称</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.bz_ryname"/>
          </td>
          <td>标准物质批号/生产厂商</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.bz_wzph"/>
          </td>
        </tr>
        <tr>
          <td>标准物质取样质量( )</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_bzwzqyzl"/>
          </td>
          <td>定容体积（ ）</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_drtj"/>
          </td>
        </tr>
        <tr>
          <td>配制日期</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_pzrq"/>
          </td>
          <td>标准物质浓度( )</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_bzwznd"/>
          </td>
        </tr>
        <tr>
          <td>基准溶液名称</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_jzrymc"/>
          </td>
          <td>基准物质批号/生产厂商</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_jzwzph"/>
          </td>
        </tr>
        <tr>
          <td>基准物质取样质量( )</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_jzwzqyzl"/>
          </td>
          <td>定容体积（ ）</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_drtj1"/>
          </td>
        </tr>
        <tr>
          <td>配制日期</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_pzrq2"/>
          </td>
          <td>基准物质浓度( )</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rypz.ry_jzwznd"/>
          </td>
        </tr>
        <tr>
          <td colspan="8">
            <div class="table-td">
              标定过程
            </div>
          </td>
        </tr>
        <tr>
          <td>取基准溶液体积(mL)</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.qjzrytj"/>
          </td>
          <td>溶剂</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.rj"/>
          </td>
          <td>定容体积(mL)</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.drtj"/>
          </td>
        </tr>
        <tr>
          <td>计算公式</td>
          <td colspan="7">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder="请输入"
                      v-model="waterForm.js_formula2"/>
          </td>
        </tr>
        <tr>
          <td rowspan="2">滴定次数</td>
          <td colspan="4" style="text-align: center">滴定体积（mL）</td>
          <td colspan="3" rowspan="2">标准溶液标定浓度C( )</td>
        </tr>
        <tr>
          <td>始读数</td>
          <td colspan="2">终读数</td>
          <td>净用量V</td>
        </tr>
        <tr>
          <td>第一次</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_11"/>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_12"/>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_13"/>
          </td>
          <td colspan="3" rowspan="4">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_14"/>
          </td>
        </tr>
        <tr>
          <td>第二次</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_21"/>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_22"/>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_23"/>
          </td>
        </tr>
        <tr>
          <td>第三次</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_31"/>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_32"/>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_33"/>
          </td>
        </tr>
        <tr>
          <td>第四次</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_41"/>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_42"/>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bdgc.bzhcyllz_43"/>
          </td>
        </tr>
        <tr>
          <td colspan="2">4平行极差的相对值</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxjcdxdz">
            </el-input>
          </td>
          <td colspan="1">重复性临界极差CrR95(4)</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.cfxljjc">
            </el-input>
          </td>
        </tr>
        <tr>
          <td colspan="2">标准溶液浓度C0（ ）</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bzryndc0">
            </el-input>
          </td>
          <td colspan="1">标准溶液校正系数</td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.bzryjzxs">
            </el-input>
          </td>
        </tr>
        <tr>
          <td colspan="8">
            <div class="table-td">
              平行样测定
            </div>
          </td>
        </tr>
        <tr>
          <td colspan="1">平行样编号</td>
          <td colspan="2" style="text-align: center;">与</td>
          <td colspan="2" style="text-align: center;">与</td>
          <td colspan="3" style="text-align: center;">与</td>
        </tr>
        <tr>
          <td>测定浓度（ ）</td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd01">
            </el-input>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd02">
            </el-input>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd03">
            </el-input>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd04">
            </el-input>
          </td>
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd05">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.cdnd06">
          </el-input>
          </td>
        </tr>
        <tr>
          <td>
            <el-radio-group>
              <el-radio value="Value 1">相对偏差</el-radio>
              <el-radio label="Label 2 & Value 2">——————</el-radio>
            </el-radio-group>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.xdpc01">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.xdpc02">
            </el-input>
          </td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.xdpc03">
            </el-input>
          </td>
        </tr>
        <tr>
          <td>质控要求</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.zkyq01">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.zkyq02">
            </el-input>
          </td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.zkyq03">
            </el-input>
          </td>
        </tr>
        <tr>
          <td>是否合格</td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.sfhg01">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.sfhg02">
            </el-input>
          </td>
          <td colspan="3">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="waterForm.pxycd.sfhg03">
            </el-input>
          </td>
        </tr>
        <tr>
          <td colspan="8">
            <div class="table-td">
              标准样品测定
            </div>
          </td>
        </tr>
        <tr>
          <td>标样批号</td>
          <td colspan="2">测定浓度（ ）</td>
          <td colspan="2">标准值（ ）</td>
          <td colspan="2">是否合格</td>
        </tr>
        <tr v-for="(item,index) in waterForm.bzycd" :key="index">
          <td>
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="item.byph">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="item.cdnd">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="item.bzz">
            </el-input>
          </td>
          <td colspan="2">
            <el-input style="width: 100%;border: 1px solid transparent" placeholder=""
                      v-model="item.sfhg">
            </el-input>
          </td>
        </tr>
        <tr>
          <td>备注</td>
          <td colspan="7">
            <el-input style="width: 240px;border: 1px solid transparent"/>
          </td>
        </tr>
      </table>
    </el-card>
  </div>

</template>

<style scoped>
.card {
  padding: 20px 25px;
}

.table {
  width: 100%;
  border-collapse: collapse; /* 表格边框合并 */
  text-align: left; /* 默认左对齐 */
  font-size: 14px; /* 字体大小 */
  color: #606266; /* 默认字体颜色 */
}

.table th,
.table td {
  border: 1px solid #c2bfbf; /* 表格单元格边框颜色 */
  padding: 12px; /* 单元格内边距 */
}

.table th {
  background: #f5f7fa; /* 表头背景色 */
  font-weight: 600; /* 表头字体加粗 */
  color: #303133; /* 表头字体颜色 */
  text-align: center; /* 表头居中 */
}

.table td {
  width: 15%;
}

.table-td {
  display: flex;
  justify-content: center;
  font-weight: 500;
  color: #303133;
}


::v-deep .el-input__wrapper {
  background-color: transparent;
  box-shadow: none;
  flex-direction: row-reverse;
}

::v-deep .el-select__wrapper {
  background-color: transparent;
  box-shadow: none;
}

::v-deep .el-input-group__append {
  background-color: transparent;
  box-shadow: none;
}
</style>
